<template>
  <Main :type="'form'">
    <Title :title="pageName" />
    <el-row>
      <el-col :span="24">
        <el-form ref="form" label-width="150px" :model="form" :rules="form">
          <el-form-item
            label="门店名称"
            prop="name"
            :rules="{
              required: true,
              message: '请输入门店名称',
              trigger: 'blur'
            }"
          >
            <el-input
              v-model="form.name"
              class="form-input"
              placeholder="请输入门店名称"
              style="line-height:20px;"
              size="medium"
              maxlength="20"
              show-word-limit
            ></el-input>
          </el-form-item>
          <el-form-item label="选择权限">
            <el-checkbox-group v-model="form.checkList">
              <el-checkbox
                v-for="(item, index) in checkbox"
                :key="index"
                :label="item.val"
                >{{ item.label }}</el-checkbox
              >
            </el-checkbox-group>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
    <Footer>
      <el-button plain @click="$emit('out')">取 消</el-button>
      <el-button type="primary" @click="submit">保 存</el-button>
    </Footer>
  </Main>
</template>
<script>
import { SETADDRESSDEPOT } from "@/service/shop";
export default {
  props: {
    dataMsg: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      pageName: "新建权限",
      form: {
        name: "",
        checkList: []
      },
      checkbox: [
        { val: 1, label: "概述" },
        { val: 2, label: "装修" },
        { val: 3, label: "用户" },
        { val: 4, label: "门店" },
        { val: 5, label: "商品" },
        { val: 6, label: "订单" },
        { val: 7, label: "会员卡" },
        { val: 8, label: "配送" },
        { val: 9, label: "优惠劵" },
        { val: 10, label: "营销" },
        { val: 11, label: "微信" },
        { val: 12, label: "设置" }
      ]
    };
  },
  created() {
    let json = JSON.stringify(this.dataMsg);
    if (json !== "{}") {
      this.pageName = "编辑权限";
      this.form.name = this.dataMsg.name;
    } else {
      this.pageName = "新建权限";
    }
  },
  methods: {
    async submit() {
      await this.$refs["form"].validate(valid => {
        if (valid) {
          SETADDRESSDEPOT({
            flag: "save",
            name: this.form.name
          }).then(res => {
            let { code, msg } = res;
            if (code === 200) {
              this.$emit("out");
            }
            this.$message({
              message: msg,
              type: code === 200 ? "success" : "error"
            });
          });
        }
      });
    }
  }
};
</script>
<style lang="scss" scoped></style>
